/**
 * Created by nitin on 4/16/14.
 */
function DatePickerCtrl($scope, $animate, $filter, $element) {
    $scope.dateSeletedValue;
//    $animate.enabled(false);
    MONTH_VIEW = 0;
    YEAR_VIEW = 1;
    TENYEAR_VIEW = 2;
    DATE_ITEM = "date";
    MONTH_ITEM = "month";
    YEAR_ITEM = "year";
    ANIMATE_LEFT = "left";
    ANIMATE_RIGHT = "right";
    ANIMATE_UP = "up";
    ANIMATE_DOWN = "down";
    function offset(elm) {
        try {
            return elm.offset();
        } catch (e) {
        }
        var rawDom = elm[0];
        var _x = 0;
        var _y = 0;
        var body = document.documentElement || document.body;
        var scrollX = window.pageXOffset || body.scrollLeft;
        var scrollY = window.pageYOffset || body.scrollTop;
        _x = rawDom.getBoundingClientRect().left + scrollX;
        _y = rawDom.getBoundingClientRect().top + scrollY;
        return { left: _x, top: _y,
            height: rawDom.getBoundingClientRect().height,
            width: rawDom.getBoundingClientRect().width
        };
    }

    $scope.datePicker = {
        dom: $element,
        isShowed: false,
        show: function (position) {
            this.isShowed = true;
            this.dom.css(position);
        },
        hide: function (position) {
            this.isShowed = false;
        },
        current: null,
        target: null,
        mode: "after",
        masterText: "",
        view: MONTH_VIEW,
        animate: "animate-slide",
        onSelect: function (e) {
            this.target = angular.element(e.target);
            var off = offset(this.target);
            this.show({top: (off.height + off.top) + "px", left: off.left + "px"});
        },
        onItemClick: function (e) {
            switch (e.type) {
                case DATE_ITEM:
                    this.current = e.value;
                    this.target.val($filter('date')(this.current, "dd/MM/yyyy"));
                    this.hide();
                    break;
                case MONTH_ITEM:
                case YEAR_ITEM:
                    this.view--;
                    this.current = e.value;
                    this.change(0);
                default :
                    break;
            }
        },
        change: function (gap) {
            var y = this.current.getFullYear(),
                m = this.current.getMonth(),
                d = this.current.getDate();
            switch (this.view) {
                case MONTH_VIEW:
                    this.current = new Date(y, m + gap, d);
                    break;
                case YEAR_VIEW:
                    this.current = new Date(y + gap, m, d);
                    break;
                case TENYEAR_VIEW:
                    this.current = new Date(y + 10 * gap, m, d);
                    break;
                default :
                    break;
            }
            var anim = gap == 0 ? ANIMATE_DOWN :
                    gap > 0 ? ANIMATE_RIGHT : ANIMATE_LEFT;
            this.changeAnimate(anim);
            this.mode = this.mode == "after" ? "before" : "after";
            this.init();
        },
        changeAnimate: function (name) {
            var anim = angular.element(document.querySelector(".date-picker-list"));
            anim.removeClass("up down left right");
            anim.addClass(name);

            this.animate = name;
        },
        onNext: function () {
            this.change(1);
        },
        onMaster: function () {
            this.view = this.view > 1 ? this.view : this.view + 1;
            this.changeAnimate(ANIMATE_UP);
            this.mode = this.mode == "after" ? "before" : "after";
            this.init();
        },
        onPrev: function () {
            this.change(-1);
        },
        onCurrent: function () {
            var crr = new Date();
            if (this.current.getMonth() == crr.getMonth()
                && this.current.getYear() == crr.getYear())
                return;
            this.current = crr;
            this.view = MONTH_VIEW;
            this.change(0);
        },
        calendar: [],
        init: function () {
            if (!this.current)
                this.current = new Date();
            var y = this.current.getFullYear(), m = this.current.getMonth(), d = this.current.getDate();
            var firstDay = new Date(y, m, 1);
            var lastDay = new Date(y, m + 1, 0);

            switch (this.view) {
                case MONTH_VIEW:
                    this.calendar = [
                        {text: "SU", value: "", type: "", disabled: true},
                        {text: "MO", value: "", type: "", disabled: true},
                        {text: "TU", value: "", type: "", disabled: true},
                        {text: "WE", value: "", type: "", disabled: true},
                        {text: "TH", value: "", type: "", disabled: true},
                        {text: "FR", value: "", type: "", disabled: true},
                        {text: "SA", value: "", type: "", disabled: true}
                    ];
                    var firstDayPrev = new Date(y, m - 1, 1);
                    var lastDayPrev = new Date(y, m, 0),
                        yl = lastDayPrev.getYear(),
                        ml = lastDayPrev.getMonth(),
                        dl = lastDayPrev.getDate();
                    for (var i = firstDay.getDay(); i > 0; i--)
                        this.calendar.push({text: dl - i + 1, value: new Date(yl, ml, dl - i + 1), type: DATE_ITEM, hidden: true});
                    for (var i = 1; i <= lastDay.getDate(); i++)
                        this.calendar.push({text: i, value: new Date(y, m, i), type: DATE_ITEM});
                    for (var i = 1; i <= 6 - lastDay.getDay(); i++)
                        this.calendar.push({text: i, value: new Date(y, m + 1, i), type: DATE_ITEM, hidden: true});
                    this.masterText = $filter('date')(this.current, "MMM yyyy");
                    break;
                case YEAR_VIEW:
                    this.masterText = $filter('date')(this.current, "yyyy");
                    this.calendar = [];
                    for (var i = 0; i < 12; i++)
                        this.calendar.push({text: i + 1, value: new Date(y, i, d), type: MONTH_ITEM});
                    break;
                case TENYEAR_VIEW :
                    this.masterText = "";
                    this.calendar = [];
                    var tenYBegin = y - y % 10;
                    if (tenYBegin - 1 < 1900)
                        this.calendar.push({text: "", value: "", type: "", disabled: true});
                    else
                        this.calendar.push({text: tenYBegin - 1, value: new Date(tenYBegin - 1, m, d), type: YEAR_ITEM, hidden: true});
                    for (var i = 0; i < 10; i++)
                        this.calendar.push({text: tenYBegin + i, value: new Date(tenYBegin + i, m, d), type: YEAR_ITEM});
                    if (tenYBegin + 10 > 2099)
                        this.calendar.push({text: "", value: "", type: "", disabled: true});
                    else
                        this.calendar.push({text: tenYBegin + 10, value: new Date(tenYBegin + 10, m, d), type: YEAR_ITEM, hidden: true});

                    this.masterText = tenYBegin + " - " + (tenYBegin + 10 - 1);
                    break;
                default :
                    break;
            }
        }}
    $scope.datePicker.init();
}